<template>
    <view>
        <cu-custom bgColor="bg-blue-11" :isBack="true">
            <view slot="backText">
                返回
            </view>
           <view slot="content" v-if='vjq>0'>
                加权:{{vjq}}-绩点:{{vjd}}
            </view>
        </cu-custom>
        <view class="bg-blue-1">
            <view class="cu-bar bg-white solid-bottom">
                <view class="action">
                    <text class="cuIcon-title text-orange"></text>选择学期
                </view>
                <view class="action">
                    <term-picker @choiceSession="choiceSession"  @confirm="confirmClick"></term-picker>
                </view>
            </view>
        </view>
        <!-- 主体展示页面 -->
        <view class="animation-slide-bottom margin list-container" v-if="gradeList.length">
            <view class="list-head bg-blue-1">
                <view class="">
                    课程名
                </view>
                <view class="">
                    选中/总评
                </view>
            </view>
            <view class="list-item text-black" v-for='(item, index) in gradeList' :key='index' :class="index%2?'bg-gray':'bg-white'">
                <view class="list-subitem">
                    <text class="text-bold">{{item.cname}}</text>
                    <switch class="cyan sm" @click="choChange(index)" :checked='choFlag[index]'></switch>
                </view>
                <view class="list-subitem margin-top-sm">
                    <view class="flex-sub text-left">
                        学分：{{(item.score-7) / 10}}
                    </view>
                    <view class="flex-sub text-center">
                        绩点：{{(item.score-3) / 10}}
                    </view>
                    <view class="flex-sub text-right">
                        <button class="cu-btn bg-orange-1 round shadow sm" @click="detailGrade(item.id,item.cname)">成绩：{{item.score}}</button>
                    </view>
                </view>
            </view>
            <view class="list-head bg-blue-1">
            </view>
        </view>
        <!-- 提示区域 -->
        <cu-empty :type="emptyType">
            <view slot="text" class="">
                <view class="margin-bottom-sm">{{emptyMsg}}</view>
                <button v-if="emptyType=='search'" class="cu-btn bg-orange-1 round shadow-blur" @click="getGrade">查询</button>
            </view>
        </cu-empty>
    </view>
</template>

<script>
    import termPicker from '@/components/term-picker/term-picker'
	import {
		req,
		reqJson
	} from '../../../utils/util.js'
    export default {
        data() {
            return {
                sessionId: "",
                vjq: 'NaN',
                vjd: 'NaN',
                gradeList: [],
                choFlag: [],
                emptyType: "search",
                emptyMsg: "点击最上方按钮切换学期，或点击下方按钮直接查询。",
            }
        },
        components: {
            termPicker
        },
		mounted() {
			this.getGrade()
		},
        methods: {
            choiceSession:function(e) {
				console.log(e)
                this.sessionId = e
            },
            confirmClick: function() {
                this.getGrade()
            },
            getGrade: function() {
                let postData = {
                    uId: uni.getStorageSync('user_info').id,
                    sessionId: this.sessionId,
                }
                this.$reqJson("wxapi/score", "get", postData, res => {
				   this.gradeList=res.content
                })
            },
            // 查看详情分数
            detailGrade: function(id,courseName) {
                this.$reqJson('wxapi/score/'+id, 'post', {},function(res) {
				    console.log(res)
					let str=''
					str+="课程名称："+res.cname+"\t分数:"+res.score
					uni.showModal({
						title: courseName,
						content:str ,
						showCancel: false,
					})
                })
			},
            // 是否选中课程
            choChange: function(index) {
                this.choFlag[index] = !this.choFlag[index]
                this.calcu()
            },
            // 计算加权与绩点
            calcu: function() {
                let sumxf = 0;
                let count = 0;
				let vjq=0;
				let vjd=0
                for (let i = 0; i < this.gradeList.length; i++) {
                    if (this.choFlag[i]) {
                        count++;
                        sumxf += parseFloat(this.gradeList[i].score);
                        switch (this.gradeList[i].score) {
                            case '优秀':
                                vjq += 90 * parseFloat(this.gradeList[i].score);
                                break;
                            case '良好':
                                vjq += 85 * parseFloat(this.gradeList[i].score);
                                break;
                            case '中等':
                                vjq += 75 * parseFloat(this.gradeList[i].score);
                                break;
                            case '合格':
                                vjq += 80 * parseFloat(this.gradeList[i].score);
                                break;
                            case '及格':
                                vjq += 60 * parseFloat(this.gradeList[i].score);
                                break;
                            case '不及格':
                            case '不合格':
                                vjq += 50 * parseFloat(this.gradeList[i].score);
                                break;
                            default:
                                vjq += parseFloat(this.gradeList[i].score) * parseFloat(this.gradeList[i].score);
                        }

                        vjd += parseFloat((this.gradeList[i].score-3)/10) * parseFloat(this.gradeList[i].score);
                    }
                }
                // console.log(sumxf, vjq, vjd)
                if (count) {
                    this.vjq = (vjq / sumxf).toFixed(2)
                    this.vjd = (vjd / sumxf).toFixed(2)
                } else {
                    this.vjq = 'NaN'
                    this.vjd = 'NaN'
                }
            },
        }
    }
</script>

<style lang="scss" scoped>

</style>
